// 修改记录

import { ScrollView, View } from "@tarojs/components";
import ByPopupBottom, {
  ByPopupBottomEvent,
} from "@/components/ui/ByPopupBottom";
import BySquare from "@/components/ui/BySquare";
import ListView from "@/components/app/ListView";

import useFetch from "@/hooks/useFetch";
import ApiCrm from "@/api/crm";
import ByText from "@/components/ui/ByText";

const typeMap = {
  1: "创建",
  2: "修改",
};

export default ({
  intentCustomerId,
  onCancel,
}: ByPopupBottomEvent & { intentCustomerId: number }) => {
  const { loading, data } = useFetch<{ dispatchRecordList: any[] }>(
    ApiCrm.getDispatchRecord,
    {
      defaultParams: [{ intentCustomerId }],
    }
  );

  const list = data?.dispatchRecordList || [];

  return (
    <ByPopupBottom title="修改记录" onCancel={onCancel}>
      <ScrollView scrollY className="h-[70vh]">
        <ListView loading={loading} isEmpty={list.length === 0}>
          {list.map((item, index) => (
            <View className={`mx-3 flex ${index > 0 && "mt-4"}`} key={item.id}>
              <BySquare size={16} className="bg-primary mt-2" />
              <View className="flex-auto pl-2">
                <ByText size="sm" type="third">
                  {item.createDate}
                </ByText>
                <View className="mt-2">
                  {item.createUserName} {typeMap[item.type]}
                </View>
                <View className="mt-1 text-second">{item.content}</View>
              </View>
            </View>
          ))}
        </ListView>

        <View className="safe-footer" />
      </ScrollView>
    </ByPopupBottom>
  );
};
